export function useMain(appRef: any) {
  // 获取根元素，并获取原始宽高（从样式中获取）
  const baseWidth = 1680
  const baseHeight = 456
  let timer: any = null

  // 原始缩放比例
  const scale = {
    width: 1,
    height: 1
  }

  // 缩放比例的方法
  const calcRate = () => {
    if(((window.innerWidth/window.innerHeight) < 1) || ((window.innerWidth/window.innerHeight) > 3)) {
      return
    }

    // window.innerWidth 窗口宽度，baseWidth 容器的宽度
    scale.width=Number(((window.innerWidth)/baseWidth).toFixed(5))
    scale.height=Number(((window.innerHeight)/baseHeight).toFixed(5))
    // 分别设置水平和垂直缩放
    appRef.style.transform=`scale(${scale.width},${scale.height})`
  }

  const resize = () => {
    if(timer) {
      clearTimeout(timer)
    }
    timer = setTimeout(() => {
      calcRate()
    }, 200)
  }
  const windowDraw = () => {
    // 窗口事件监听
    window.addEventListener('resize', resize)
  }

  return {calcRate, windowDraw}
}